<template>
    <lay-card>

<template v-slot:body>
    <lay-row>
        <lay-col>
            <lay-table :loading="config.loading" :resize="true" 
                :columns="config.columns" :page="config.page" @change="change" :data-source="config.data"
                v-model:selectedKey="config.selectedKey" v-model:selectedKeys="config.selectedKeys"
                class="project-grids">


                <template v-slot:operator="{ row }">
                    <span v-for="n in listbutton.rowbuttons" :key="n">
                        <lay-tooltip :content="n.name" position="bottom" :is-dark="true">
                            <button class="a-button type--button is--circle" circle @click="Events(n, row)">
                                <lay-icon :type="n.icon" :color="n.color">

                                </lay-icon>
                            </button>
                        </lay-tooltip>

                    </span>

                </template>
     
                <template #source="{ row }">
                    <div>
                        {{getSource(row)}}
                    </div>

                </template>
                <template #number="{ row }">
                    <div>
                        {{row.number}}次就餐
                    </div>

                </template>
            </lay-table>
        </lay-col>


    </lay-row>
</template>
</lay-card>
</template>
<script lang="ts">
export default {
    name: "mianwait"
}
</script>
<script lang="ts" setup>
import { ref, nextTick } from "vue";
import { layer } from "@layui/layer-vue";
import webosutils from 'webosutils';

import { ReleaseIcon } from '@layui/icons-vue';

import listurils from '../../utils/listutils';
import { LayerForm} from 'webos-form-design';
import moment from "moment";
interface IoderreportdetailsProps {
    title: any, type: any, startdate: any, enddate: any, limit: any, appid: any
}
const props = withDefaults(defineProps<IoderreportdetailsProps>(), {
    title: String, fromid: String, enddate: String, limit: Number, appid: String
});
console.log(props);
const active4 = ref("");
const selectedKeys = ref([]);

const typelist = ref<any>([]);
const listbutton = ref({
    rowbuttons: [] as any,
    toolbarbuttons: [] as any,
});
const size = ref("sm");
const getSource = (row: any) => {
    switch (row.source + "") {
        case '0':
            return '扫码消费';
        case '1':
            return '线上订单';

        default:
            return '未知';
    }
}

const config = ref({
    loading: true,
    data: [],
    page: {
        total: 0,
        limit: props.limit == null ? 10 : props.limit,
        current: 1,
        showRefresh: true,
        limits: [5, 10, 20, 50, 100, 200, 1000, 2000, 5000]
    },
    selectedKey: "",
    selectedKeys: [],
    columns: [

        { title: "序号", width: "55px", key: "rownum", fixed: "left" },


        { key: 'name', title: '姓名', ellipsisTooltip: true, },
        { key: 'jobid', title: '工号', ellipsisTooltip: true },

        { key: 'deptname', title: '单位名称', ellipsisTooltip: true },
        { key: 'createtime', title: '订餐时间', ellipsisTooltip: true },
        { key: 'completetime', title: '就餐时间', ellipsisTooltip: true },
        { key: 'mealtype', title: '餐类', ellipsisTooltip: true },
        { key: 'source', title: '分类', customSlot: "source", ellipsisTooltip: true },
        { key: 'position', title: '岗位', ellipsisTooltip: true },
        { key: 'number', title: '当天就餐次数', ellipsisTooltip: true,customSlot:"number" } ,
        { key: 'note', title: '备注', ellipsisTooltip: true}
    ],
    api: "",
    search: {
        type: props.type,
        startdate: props.startdate,
        enddate: props.enddate,
        title: props.title
    }
});
const signleImg = (row: any) => {
    layer.photos({
        imgList: [{ src: row.img, alt: row.title }]
    })
}
const getFoodtype = () => {
    //
    if (typelist.value.length == 0) {
        webosutils.http.post("/v1/api/form/GetDictionaryByCode", { id: "dw_food_type" }).then((res: any) => {
            if (res.success) {

                typelist.value = res.data;
            }
        }).catch(err => {
            console.log(err);
        })
    }
}
listurils.getButton(props.appid, config, listbutton).then((res: any) => {
    //加载完成后刷新列表

    if (res.success) {
        config.value.api = res.data.api;
        if (listbutton.value.toolbarbuttons.length > 0) {
            size.value = listbutton.value.toolbarbuttons[0].size;
        }
        listurils.searchEvent(config);
    } else {
        layer.notify({
            title: "Error",
            content: res.msg,
            icon: 2
        })
    }

});
const change = (p: any) => {

    config.value.page.current = p.current;
    config.value.page.limit = p.limit;
    listurils.searchEvent(config);
}
const Callback = () => {
    listurils.searchEvent(config);
}
const Events = (ent: any, row: any) => {
    try {

        switch (ent.events) {
            case "editEvent":
                if (ent.ispopup == 0) {
                    var query = new Object() as any;
                    query.fromid = ent.formid;
                    query.instanceid = row.id;
                    // query.zhuanti = row.classid;
                    query.tabname = encodeURIComponent(row.title);
                  //  router.push({ path: "/formdesign/submitfrom", query: query })


                } else {
                    listurils.editRowEvent(LayerForm, ent, row, { fromid: ent.formid, instanceid: row.id, callback: Callback }, {});

                }
                break;
            case "searchEvent":
                if (config.value.page) {
                    listurils.searchEvent(config);
                }

                break;
            case "deleteEvent": listurils.removeRowEvent(ent, row, listurils.searchEvent, config);
                break;
            case "addEvent":
                if (ent.ispopup == 0) {
                    var query = new Object() as any;
                    query.fromid = ent.formid;
                    query.instanceid = "";
                  //  query.zhuanti = route.query.zhuanti;
                    query.tabname = encodeURIComponent(ent.title);
                  //  router.push({ path: ent.api, query: query })

                } else {
                    listurils.addEvent(LayerForm, ent, { fromid: ent.formid, instanceid: "", callback: Callback }, {});

                }
                break;

            case "previewEvent": listurils.previewEvent(LayerForm, ent, row);
                break;
            case "SelectEvent":
                listurils.SelectEvent(ent, row, listurils.searchEvent, config);
                break;
        }
    } catch (e) {
        layer.msg("按钮解析失败", { icon: 3, time: 1000 })
    }

}
getFoodtype();
</script>
<style scoped></style>